<template>
    <div class="link-btn" @click="showPage">
        <!--S推广链接-->
        <svg class="icon"><use xlink:href="#icon-tuiguanglianjie1"></use></svg>
        {{link.name}}
        <!--E推广链接-->
    </div>
</template>

<script>
    import store from "../../../../store/index";
    export default {
        name: "LinkBtn",
        props:{
            link:{
                type:Object
            }
        },
        methods:{
            /**
             * 显示外部页面组件
             */
            showPage(){
                store.commit("setPage",{
                    show:true,
                    src:this.link.link,
                    onClose:()=>{
                        store.commit("setPage",{show:false})
                    }
                });
            }
        }
    }
</script>

<style scoped lang="less">
    .link-btn{
        position: absolute;
        min-width: 60px;
        height: 25px;
        line-height: 26px;
        z-index: 10;
        left:10px;
        bottom: 70px;
        background: #FF9D2A;
        color:#fff;
        padding:0 5px;
        font-size: 12px;
        border-radius: 12.5px;
        .icon{
            width: 20px;
            height: 20px;
            float: left;
            margin: 1px 5px 0 0;
        }
    }
</style>